<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
	String ctxPath = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ ctxPath + "/";
	String SYSTEM_NAME = "EZMES";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'add_user.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<base id="baseUrl" href="<%=basePath%>"/>
<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

</head>
<link href="<%=basePath%>css/bootstrap.min.css?v=3.4.0"
	rel="stylesheet">
<link href="<%=basePath%>css/font-awesome.min.css?v=4.3.0"
	rel="stylesheet">

<!-- Data Tables -->
<link href="<%=basePath%>css/animate.min.css" rel="stylesheet">
<link href="<%=basePath%>css/style.min.css?v=3.0.0" rel="stylesheet">
<body>
	<form action="question/add_question_one" method="post" id="formId" enctype="multipart/form-data" onsubmit="return sumbitFunc()" >
	<div id="one">
		<!-- <div class="col-md-12" style="margin-top: 10px;margin-bottom: 10px">
		<div class="progress">
		   <div class="progress-bar progress-bar-success" role="progressbar" 
		      aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" 
		      style="width: 40%;">
		      <span class="sr-only">40% 完成</span>
		   </div>
		   <div class="progress-bar progress-bar-info" role="progressbar" 
		      aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" 	
		      style="width: 30%;">
		      <span class="sr-only">30% 完成（信息）</span>
		   </div>
		   <div class="progress-bar progress-bar-warning" role="progressbar" 
		      aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" 	
		      style="width: 20%;">
		      <span class="sr-only">20% 完成（警告）</span>
		   </div>
		</div>
	</div> -->
	<div class="col-md-12">
	    <div class="form-group" style="padding: 20px">
	    	<input type="hidden" name="question.e_id" value="${exam.e_id}"/>
	        <label class="col-sm-2 control-label">试题类型：</label>
	        <div class="col-sm-10">
	           <select class="form-control"  name="question.qt_id">
			   	<option value="">请选择</option>
					<c:forEach items="${qts}" var="qt">
						<option value="${qt.qt_id}">${qt.qt_name}</option>
					</c:forEach>
			   </select>
	        </div>
	    </div>
	    <div class="form-group" style="padding: 20px">
	        <label class="col-sm-2 control-label">知识点：</label>
	        <div class="col-sm-10">
	            <select class="form-control"  name="question.p_id">
			   	<option value="">请选择</option>
					<c:forEach items="${ps}" var="p">
						<option value="${p.p_id}">${p.p_name}</option>
					</c:forEach>
			   </select>
	        </div>
	    </div>
	</div> 
	<div class="col-md-12" style="text-align: center;margin-top: 10px">
		<button type="button" class="btn btn-primary" onclick="next()"><i class="fa fa-check"></i> 下一步</button>
	</div>
	</div>
	<div id="two" style="display: none;">
		<!-- <div class="col-md-12" style="margin-top: 10px;margin-bottom: 10px">
		<div class="progress">
		   <div class="progress-bar progress-bar-success" role="progressbar" 
		      aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" 
		      style="width: 40%;">
		      <span class="sr-only">40% 完成</span>
		   </div>
		   <div class="progress-bar progress-bar-info" role="progressbar" 
		      aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" 	
		      style="width: 30%;">
		      <span class="sr-only">30% 完成（信息）</span>
		   </div>
		   <div class="progress-bar progress-bar-warning" role="progressbar" 
		      aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" 	
		      style="width: 20%;">
		      <span class="sr-only">20% 完成（警告）</span>
		   </div>
		</div>
	</div> -->
	<div class="form-group" style="padding: 20px">
        <label class="col-sm-2 control-label">题干：</label>
        <div class="col-sm-10">
        	<textarea rows="5" cols="120" id="danxuanContentId"  placeholder="请输入题干内容" name="question.q_content"></textarea>
            <!-- <input type="email" name="user.u_email" class="form-control"  placeholder="请输入题干内容"> -->
        </div>
    </div>
	<div class="col-md-12">
	    <div class="form-group" style="padding: 20px">
	        <label class="col-sm-12 control-label">上传图片（如果没有请直接下一步）：</label>
	    </div>
	</div>
	<div class="col-md-12">
	    <div class="form-group" style="padding: 20px">
	        <label class="col-sm-2 control-label">图片1：</label>
	        <div class="col-sm-10">
	            <input type="file" name="quesitonImg.src1" class="form-control" style="border: 0px">
	        </div>
	    </div>
	</div>
	<div class="col-md-12">
	    <div class="form-group" style="padding: 20px">
	        <label class="col-sm-2 control-label">图片2：</label>
	        <div class="col-sm-10">
	            <input type="file" name="quesitonImg.src2" class="form-control" style="border: 0px">
	        </div>
	    </div>
	</div>
	<div class="col-md-12" style="text-align: center;margin-top: 10px">
		<button type="button" id="isSubmit" class="btn btn-primary" onclick="up()"><i class="fa fa-check"></i> 上一步</button>
		<button type="button" id="isSubmit" class="btn btn-primary" onclick="next2()"><i class="fa fa-check"></i> 下一步</button>
	</div>
	</div>
	<div id="three" style="display: none;">
	<!-- <div class="col-md-12" style="margin-top: 10px;margin-bottom: 10px">
		<div class="progress">
		   <div class="progress-bar progress-bar-success" role="progressbar" 
		      aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" 
		      style="width: 40%;">
		      <span class="sr-only">40% 完成</span>
		   </div>
		   <div class="progress-bar progress-bar-info" role="progressbar" 
		      aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" 	
		      style="width: 30%;">
		      <span class="sr-only">30% 完成（信息）</span>
		   </div>
		   <div class="progress-bar progress-bar-warning" role="progressbar" 
		      aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" 	
		      style="width: 20%;">
		      <span class="sr-only">20% 完成（警告）</span>
		   </div>
		</div>
	</div> -->
    <div id="radeioDivId">
    <div id="oneOptionDiv" class="col-md-12" class="form-group" style="padding 20px">
        <label class="col-sm-1 control-label">
        	<select name="option.o_logo">
        		<option value="A">A</option>
        		<option value="B">B</option>
        		<option value="C">C</option>
        		<option value="D">D</option>
        		<option value="E">E</option>
        		<option value="F">F</option>
        		<option value="G">G</option>
        		<option value="H">H</option>
        		<option value="I">I</option>
        		<option value="J">J</option>
        		<option value="K">K</option>
        	</select>
        </label>
        <label class="col-sm-1 control-label">
        	<input type="radio" name="a" value="A" onchange="selectrRdiro('oneOptionDiv')">
        </label>
        <div class="col-sm-9">
            <textarea rows="2" cols="120" name="option.o_content"  placeholder="请输入选项内容"></textarea>
        </div>
        <label class="col-sm-1 control-label">
        	<a href="javascript:deleteOption('oneOptionDiv')" class="btn btn-primary btn-xs p310"><i class="im-plus"></i>删除</a>
        </label>
    </div>
    <div  id="twoOptionDiv" class="col-md-12" class="form-group" style="padding 20px">
        <label class="col-sm-1 control-label">
        	<select name="option.o_logo">
        		<option value="A">A</option>
        		<option value="B" selected="true">B</option>
        		<option value="C">C</option>
        		<option value="D">D</option>
        		<option value="E">E</option>
        		<option value="F">F</option>
        		<option value="G">G</option>
        		<option value="H">H</option>
        		<option value="I">I</option>
        		<option value="J">J</option>
        		<option value="K">K</option>
        	</select>
        </label>
         <label class="col-sm-1 control-label">
        	<input type="radio" name="a" onchange="selectrRdiro('twoOptionDiv')">
        </label>
        <div class="col-sm-9">
            <textarea rows="2" name="option.o_content" cols="120" placeholder="请输入选项内容"></textarea>
        </div>
        <label class="col-sm-1 control-label">
        	<a href="javascript:deleteOption('twoOptionDiv')" class="btn btn-primary btn-xs p310"><i class="im-plus"></i>删除</a>
        </label>
    </div>
    <div id="threeOptionDiv" class="col-md-12" class="form-group" style="padding 20px">
        <label class="col-sm-1 control-label">
        	<select name="option.o_logo">
        		<option value="A">A</option>
        		<option value="B">B</option>
        		<option value="C" selected="true">C</option>
        		<option value="D">D</option>
        		<option value="E">E</option>
        		<option value="F">F</option>
        		<option value="G">G</option>
        		<option value="H">H</option>
        		<option value="I">I</option>
        		<option value="J">J</option>
        		<option value="K">K</option>
        	</select>
        </label>
         <label class="col-sm-1 control-label">
        	<input type="radio" name="a" onchange="selectrRdiro('threeOptionDiv')">
        </label>
        <div class="col-sm-9">
            <textarea rows="2" name="option.o_content" cols="120"  placeholder="请输入选项内容"></textarea>
        </div>
        <label class="col-sm-1 control-label">
        	<a href="javascript:deleteOption('threeOptionDiv')" class="btn btn-primary btn-xs p310"><i class="im-plus"></i>删除</a>
        </label>
    </div>
    <div id="fourOptionDiv" class="col-md-12" class="form-group" style="padding 20px">
        <label class="col-sm-1 control-label">
        	<select name="option.o_logo">
        		<option value="A">A</option>
        		<option value="B">B</option>
        		<option value="C">C</option>
        		<option value="D" selected="true">D</option>
        		<option value="E">E</option>
        		<option value="F">F</option>
        		<option value="G">G</option>
        		<option value="H">H</option>
        		<option value="I">I</option>
        		<option value="J">J</option>
        		<option value="K">K</option>
        	</select>
        </label>
         <label class="col-sm-1 control-label">
        	<input type="radio" name="a" onchange="selectrRdiro('fourOptionDiv')">
        </label>
        <div class="col-sm-9">
            <textarea rows="2" name="option.o_content" cols="120"  placeholder="请输入选项内容"></textarea>
        </div>
        <label class="col-sm-1 control-label">
        	<a href="javascript:deleteOption('fourOptionDiv')" class="btn btn-primary btn-xs p310"><i class="im-plus"></i>删除</a>
        </label>
    </div>
    </div>
    <div class="form-group" style="padding: 20px">
		<label class="col-sm-2 control-label">答案：</label>
		<div class="col-sm-9">
			<input id="radioAnswer" name="question.answer" type="text" readonly = "readonly" class="form-control">
		</div>
	</div>
    <div class="col-md-12" style="text-align: center;margin-top: 10px">
		<button type="button" id="radioButton" class="btn btn-primary" onclick="addOption()"><i class="fa fa-check"></i>添加选项</button>
		<button type="submit" id="isSubmit" class="btn btn-primary"><i class="fa fa-check"></i> 添加</button>
	</div>
	</div>
</form>
</body>
<script src="<%=basePath %>js/jquery-2.1.1.min.js"></script>
<script src="<%=basePath %>js/bootstrap.min.js?v=3.4.0"></script>
<%-- <script  src="<%=basePath %>js/jquery.form.js"></script> --%>
<script src="<%=basePath %>js/plugins/jeditable/jquery.jeditable.js"></script>
<script type="text/javascript">
	function next(){
		if($("select[name='question.p_id']").val() == null || $("select[name='question.p_id']").val() == ''){
			alert("请选择知识点");
			return;
		}
		if($("select[name='question.qt_id']").val() == null || $("select[name='question.qt_id']").val() == ''){
			alert("请选择试题类型");
			return;
		}
		if($("select[name='quesiton.qt_id']").find("option:selected").text() == "案例分析题"){
			alert("哈哈，我选中了案例分析题");
			$("#isSubmit").attr({"type":"submit"});
		}
		$("#one").hide();
		$("#two").show();
	}
	function next2(){
		var content = $("#danxuanContentId").val();
		if(content == null || content == ""){
			alert("请输入题干内容同");
			return;
		}
		$("#two").hide();
		$("#three").show();
	}
	function addOption(){
		var os = $("[name='option.o_logo']");
		if(os != null && os.length >= 11){
			alert("最多只能添加11条选项");
			return;
		}
		var temp = new Date().getTime();
		var yuansu = "<div id=\""+temp+"\" class=\"col-md-12\" class=\"form-group\" style=\"padding 20px\">" +
		 "<label class=\"col-sm-1 control-label\">" +
        "<select name=\"option.o_logo\">"+
		"<option value=\"\">请选择</option>"+
		"<option value=\"A\">A</option>"+
		"<option value=\"B\">B</option>"+
		"<option value=\"C\">C</option>"+
		"<option value=\"D\">D</option>"+
		"<option value=\"E\">E</option>"+
		"<option value=\"F\">F</option>"+
		"<option value=\"G\">G</option>"+
		"<option value=\"H\">H</option>"+
		"<option value=\"I\">I</option>"+
		"<option value=\"J\">J</option>"+
		"<option value=\"K\">K</option>"+
		"</select>"+
		"</label>"+
		"<label class=\"col-sm-1 control-label\">"+
		"<input type=\"radio\" name=\"a\" onchange=\"selectrRdiro('"+temp+"')\" >"+
		"</label>"+
		"<div class=\"col-sm-9\">"+
		"<textarea rows=\"2\" name=\"option.o_content\" cols=\"120\" placeholder=\"请输入选项内容\"></textarea>"+
		"</div>"+
		"<label class=\"col-sm-1 control-label\">"+
		"<a href=\"javascript:deleteOption('"+temp+"')\" class=\"btn btn-primary btn-xs p310\"><i class=\"im-plus\"></i>删除</a>"+
		"</label>"+
		"</div>";
		$("#radeioDivId").append(yuansu);
	}
	function up(){
		$("#two").hide();
		$("#one").show();
	}
	function deleteOption(yuansu){
		new Date().getTime()
		var temp = "#"+yuansu;
		$(temp).remove();
	}
	function selectrRdiro(yuansu){
		var temp = "#"+yuansu + " select[name='option.o_logo']"
		var answer = $(temp).val();
		$("#radioAnswer").val(answer);
	}
	function sumbitFunc(){
		/*
			验证选项标识
		*/
	    var ary = new Array(); 
		var logos = $("[name='option.o_logo']");
		if(logos == null || logos.length == 0)return false;
		for(var i = 0;i<logos.length;i++){
			var value = logos[i].value;
			if(value == null || value == ''){
				alert("请选择选项标识");
				return false;
			}
			ary.push(value);
		}
		//验证选项内容
		var contens = $("[name='option.o_content']");
		for(var i = 0;i<contens.length;i++){
			var value = contens[i].value;
			if(value == null || value == ''){
				alert("请输入选项内容");
				return false;
			}
		}
		//验证答案
		var answer = $("#radioAnswer").val();
		if(answer == null || answer == ''){
			alert("请选择答案");
			return false;
		}
		//验证选项标识是否重复
		var flag = mm(ary)
		if(flag){
			alert("选项标识有重复，请修改");
			return false;
		}
		return true;
	}
	//验证数组内容重复,有重复返回true；否则返回false
	function mm(a)
	{
	   return /(\x0f[^\x0f]+)\x0f[\s\S]*\1/.test("\x0f"+a.join("\x0f\x0f") +"\x0f");
	}

</script>
</html>
